<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<title></title>
		<link rel="stylesheet" href="css/first.css" />
		<style>
				.right {
				float: right;
			}
			
			.left {
				float: left;
			}
			/*hearder*/
			
			.header {
				height: 62px;
				width: 980px;
				margin: 0px auto;
			}
			
			.logo {
				width: 179px;
				height: 39px;
				margin-top: 20px;
			}
			
			.searcher {
				height: 30;
				width: 139;
				margin-top: 20px;
			}
			
			.searcher_txt input[type=text] {
				height: 25px;
			}
			/*main*/
			
			.main {
				width: 980px;
				margin: 0 auto;
			}
			.outNav{
				height: 55px;
				background-image: url(img/nav_bg.png);
			}
			.nav {
				width: 980px;
				margin: 0px auto ;
				}

			ul li {
				list-style: none;
				float: left;
				line-height: 55px;
				padding: 0px 46px;
				background: url(img/nav_bg-line.png) no-repeat top left;
			}
			
			.nav ul li a {
				text-decoration: none;
				color: black;
			}
			
			.nav ul li a:hover {
				color: white;
			}
			/*footer ad*/
			
			.footer {
				width: 980px;
				margin: 20px auto;
			}
			.outAd{
				height: 29px;
				background: #fbfbfb;
				border-top: 1px solid #efefef;
				border-bottom: 1px solid #efefef;
				margin-bottom: 20px;
			}
			
			.ad {
				width: 980px;
				margin: 0px auto;
			}
			
			.ad_text {
				font-size: 12px;
				float: left;
				color: grey;
				margin: 6px auto;
			}
			
			.ad_pic {
				height: 12px;
				margin: 6px auto;
				float: right;
			}
			/*footer box*/
			
			.footer_left,
			.footer_mid,
			.footer_right {
				width: 300px;
				height: 300px;
				border: solid 1px beige;
				margin: 40px auto;
			}
			
			.footer_mid {
				margin-left: 40px;
			}
			
			.l_title {
				margin-top: 20px;
				margin-left: 20px;
			}
			
			.l_title_pic {
				margin: 5px 5px;
			}
			
			.l_pic {
				width: 300px;
				margin-top: 100px;
			}
			
			.l_pic_l {
				margin-left: 40px;
				margin-top: 40px;
			}
			
			.l_pic_r {
				margin-right: 10px;
				margin-top: 40px;
			}
			.m_title {
				margin-top: 20px;
				margin-left: 20px;
			}
			
			.m_title_pic{
				margin: 5px 5px;
			}

			.m_main {
				width: 280px;
				margin-top:100px;
				margin-left: 20px;
			}
			.m_main_tab{
				margin: 10px auto;
				width: 280px;
			}
			.m_main_tab tr td{
				font-size: 12px;
				color: grey;	
				border: 1px dashed darkgray;
				border-top: none;
				border-left: none;
				border-right: none;			
			}

			.r_title{
				margin-top: 20px;
				margin-left: 20px;
			}
			.r_itle_pic{
				margin: 5px 5px;
			}
			.r_main{
				width: 300px;
				margin-top: 100px;
				margin-left: 20px;
				
			}
			.r_main_tab{
				margin: 20px auto;
				width: 280px;
			}
			.r_main_tab tr td{
				font-size: 12px;
				color: grey;	
				border: 5px solid green;
				border-top: none;
				border-bottom: none;
				border-right: none;		
			}
			.r_main_address{
				width: 280px;
				margin-left: 20px;
				margin-top: 50px;
				color: grey;
				font-size: 12px;
			}

		</style>
	</head>

	<body>
		<div class="header">
			<div class="logo left">
				<img src="img/logo.jpg">
			</div>
			<div class="searcher right">
				<div class="searcher_but right">
					<img src="img/search2.jpg" />
				</div>
				<div class="searcher_txt left">
					<input type="text" value="请输入搜索内容">
				</div>
			</div>
		</div>
		<div class="outNav">
			<div class="nav">
				<ul>
					<li><a href="#">首页</a></li>
					<li><a href="#">智能手机</a></li>
					<li><a href="#">电脑</a></li>
					<li><a href="#">配件</a></li>
					<li><a href="#">服务支持</a></li>
					<li><a href="#">关于尚合</a></li>
				</ul>
			</div>
		</div>
		<div class="main">			
			<div class="banner">
				<img src="img/banner.jpg" />
			</div>
		</div>
		<div class="outAd">
			<div class="ad">
				<div class="ad_text">
					<span>最新公告：尚合Aone智能手机入网证已获取工信部门审批下发。尚合官网</span>
				</div>
				<div class="ad_pic">
					<img src="img/renren.png" />
					<img src="img/weibo.png">
					<img src="img/weibo.png" />
					<img src="img/zone.png" />
				</div>
			</div>
		</div>
		<div class="footer">
			<div class="footer_left left">
				<div class="l_title">
					<div class="l_title_pic left">
						<img src="img/o.jpg">
					</div>
					<div class="l_title_txt left">
						<span>新品发布</span>
					</div>
				</div>
				<div class="l_pic">
					<div class="l_pic_l left">
						<img src="img/left.png">
					</div>
					<div class="l_pic_m left">
						<img src="img/home_hot_01.png" />
					</div>
					<div class="l_pic_r left">
						<img src="img/right.png" />
					</div>
				</div>
			</div>
			<div class="footer_mid left">
				<div class="m_title left">
					<div class="m_title_pic left">
						<img src="img/o.jpg" />
					</div>
					<div class="m_title_txt left">
						<span>新闻中心</span>
					</div>
				</div>
				<div class="m_main">
					<table class="m_main_tab">
						<tr>
							<td style="color: red;">致歉公告</td>
						</tr>
						<tr>
							<td>致歉公告</td>
						</tr>
						<tr>
							<td>致歉公告</td>
						</tr>
						<tr>
							<td>致歉公告</td>
						</tr>
						<tr>
							<td>致歉公告</td>
						</tr>
						<tr>
							<td>致歉公告</td>
						</tr>
					</table>
				</div>
			</div>
			<div class="footer_right right">
				<div class="r_title">
					<div class="r_itle_pic left">
						<img src="img/o.jpg">
					</div>
					<div class="r_title_txt left">
						<span>新闻中心</span>
					</div>
				</div>
				<div class="r_main">
					<div class="r_main_tab">
						<table>
							<tr>
								<td>售后服务</td>
							</tr>
							<tr>
								<td>售后服务</td>
							</tr>
							<tr>
								<td>售后服务</td>
							</tr>
							<tr>
								<td>售后服务</td>
							</tr>
						</table>
					</div>
					<div class="r_main_address">
						<span>尚合公司</span><br />
						<span>联系电话：11112222</span>
					</div>
				</div>
			</div>
		</div>
	</body>

</html>